import React from 'react'
// function  组件 我们一般称为 静态组件
function Child(props) {
  console.log(props)// 对应的就是父组件传进来的数据
  let {className} = props
  setTimeout(() => {
      // props.className = 'qqqqq'
      // 子传父 这点是于vue的思想是一致的； 都是子组件不能直接修改； 需要通过 自定义事件
  }, 2000);
  return <>
    <h1 className={className}>我是儿子组件</h1>
    <div className={props.class}>哈哈哈</div>
  </>
}


//React.Component 是react的一个内置组件
//编写class组件的时候 必须继承react的内置组件
console.log(React.Component)
export class Child2 extends React.Component{
  // constructor(props){
  //   super(props) // this.props = props;  super继承相当于call继承
  // }
  render(){
    // render函数的返回值 才是当前组件爻取渲染的内容；
    console.log(this.props)
    return <>
      <h1>child2组件</h1>
    </>
  }
}


export default Child


// export var a = [1,2,3]
// export function qqq(){}
// export let b = {q:123}